<template>
	<div class="setting-user">
		<div class="setting-card">
			<div class="setting-item-title">首页相关：</div>
			<div class="setting-item-content">
				<div class="item">
					<span>轮播图</span> <el-switch v-model="form.carousel"></el-switch>
				</div>
				<div class="item">
					<span>联系我</span> <el-switch v-model="form.follow"></el-switch>
				</div>
				<div class="item">
					<span>标签云</span> <el-switch v-model="form.cate"></el-switch>
				</div>
				<div class="item">
					<span>浏览排行</span> <el-switch v-model="form.see"></el-switch>
				</div>
				<div class="item">
					<span>雁过留声</span> <el-switch v-model="form.message"></el-switch>
				</div>
			</div>
		</div>
		<div class="setting-card">
		<div class="setting-item-title">其他相关：</div>
			<div class="setting-item-content">
				<div class="item">
					<span>随意推荐</span> <el-switch v-model="form.recommend"></el-switch>
				</div>
				<div class="item">
					<span>打赏</span> <el-switch v-model="form.reward"></el-switch>
				</div>
				<div class="item">
					<span>聊天</span> <el-switch v-model="form.chat"></el-switch>
				</div>
			</div>
		</div>
		<sub-foot :prompt="prompt" :loading="loading" @saveChange="save"></sub-foot>
	</div>
</template>

<script>
	import SubFoot from 'components/setting/sub-foot'
    import {deepClone} from 'common/func'
    import {mapGetters,mapMutations} from 'vuex'

	export default {
		computed:{
	        ...mapGetters([
	            'website'
	       	])
	    },
		data() {
			return {
				prompt: '这些将控制你的页面是否显示对应板块',
				form: {
					carousel: true,
					follow: true,
					cate: true,
					see: true,
					message: true,
					recommend: false,
					reward: false,
					chat: true
				},
				loading: false
			}
		},
		created() {
			this.form = deepClone(this.website)
		},
		methods: {
			save() {
				this.loading = true
				this.$http.post('/setShowConfig', {config:this.form}).then((response) => {
					this.setWebsite(deepClone(this.form))
					this.loading = false
					this.$notify({
			          title: '显示设置操作成功',
			          message: '缓存将在10分钟后重新生成',
			          type: 'success'
			        });
				})
			},
			...mapMutations({
	            setWebsite: 'SET_WEBSITE'
	        })
		},
		components: {
			SubFoot
		}
	}

</script>

<style scope>
	.setting-user {

	}
</style>